<%= render :partial => 'messages/messages_controls' %>

<div id='messages'>
	<div id="first_message"></div>
  <div class="center" id="load-indicator">
    <div><%= t("ui.loading_messages") %></div>
    <%= image_tag("/images/big_spinner.gif") %>
  </div>
</div>

<script>
	new Ajax.Request('/conversations/<%= @conversation.id %>/messages/files.json',
    {
      method:'get',
      onSuccess: function(transport){
        var response = transport.responseText || '<%= t("errors.no_response_text") %>';
        var json = response.evalJSON();
        var html = new EJS({url: '/templates/chat.ejs'}).render(json);
        $('messages').insert({"bottom":html});
        $('load-indicator').hide();
        Misc.pageScroll();
      },
      onFailure: function(){ alert('<%= t("errors.something_went_wrong") %>') }
    });
</script>